<template>
   <section  style="height:350px; overflow:auto;">
         <div class="wp-sec-title">产品入库
         <div style=" text-align: right;margin-right:5px;">
         <el-button type="warning" @click.native="onEntry" v-if="unEntryProductList.length>0">入库</el-button>
         </div>
         </div>
               <el-table
                 size="medium"
               v-if="entryProductList.length>0"
               stripe :data="entryProductList">
                    <el-table-column
                    label="产品名称"
                    prop="productName"
                    show-overflow-tooltip
                    ></el-table-column>
                    <el-table-column label="产品类型" prop="productType" :formatter="formatterProductType"></el-table-column>
                    <el-table-column
                    label="产品型号"
                    prop="productModel"
                    show-overflow-tooltip
                    ></el-table-column>
                    <el-table-column label="产品单位" prop="unit" ></el-table-column>
                    <el-table-column label="采购数量" prop="purchaseNum"></el-table-column>
                    <el-table-column label="已入库" prop="storageNum"></el-table-column>
                    <el-table-column label="未入库" prop="unStorageNum"></el-table-column>
                </el-table>
                  <el-empty v-else></el-empty>
         <div class="wp-sec-title" style="margin-top:30px;">入库记录</div>
         <el-table
            v-if="entryProductRecordList.length>0"
          stripe :data="entryProductRecordList" >
                <el-table-column
            label="产品名称"
            prop="productName"
            show-overflow-tooltip
            ></el-table-column>
            <el-table-column
            label="产品类型"
            prop="productType" :formatter="formatterProductType"
            show-overflow-tooltip
            ></el-table-column>
            <el-table-column
            label="产品型号"
            prop="productModel"
            show-overflow-tooltip
            ></el-table-column>
            <el-table-column
            label="所属仓库"
            prop="warehouseName"
            show-overflow-tooltip
            ></el-table-column>
            <el-table-column label="入库数量" prop="productNum"></el-table-column>
            <el-table-column
            label="入库时间"
            prop="stockDate"
            show-overflow-tooltip
            >
        <template slot-scope="scope">
            <span>{{ scope.row.stockDate | FormatDate('yyyy-MM-dd') }}</span>
        </template>
            </el-table-column>
            <el-table-column label="操作人" prop="operatorName"></el-table-column>
              <el-table-column label="备注" show-overflow-tooltip prop="remark"></el-table-column>
        </el-table>
          <el-empty v-else></el-empty>
      <Product-entry-panel @afterSave="afterSave" sourceType="purchaseOrder"  ref="productEntryPanel" :operationSubTypes="operationSubTypes" />
   </section>
</template>

<script>
import Mixins from '../mixins'
import Drawer from '@/components/Drawer'
import ProductEntryPanel from '@/views/eims/components/productEntryPanel'
export default {
  props: {
    canModify: {type: Boolean, default: true},
    param: {type: String, require: true}
  },
  mixins: [Mixins],
  components: {Drawer, ProductEntryPanel},
  data () {
    return {
      entryProductList: [],
      entryProductRecordList: [],
      unEntryProductList: [],
      operationSubTypes: [ {value: 10, label: '采购单入库'} ]
    }
  },
  created () {
    this.getEntryProductList(this.param)
    this.getEntryProductRecordList(this.param)
  },
  methods: {
    onEntry () {
      this.$refs.productEntryPanel.show('新建入库单', { associateOrder: this.param, operationSubType: 10, productList: this.unEntryProductList })
    },
    afterSave (res) {
      this.getEntryProductList(this.param)
      this.getEntryProductRecordList(this.param)
    },
    getEntryProductRecordList (orderNo) {
      this.requestOption('getProductStorageByAssociateOrder', orderNo, res => {
        this.entryProductRecordList = res.data || []
      })
    },
    getEntryProductList (orderNo) {
      this.requestOption('getOrderStockInfoList', orderNo, res => {
        const list = res.data
        if (list) {
          this.entryProductList = list
          this.unEntryProductList = list.filter(item => {
            return item.unStorageNum > 0
          })
        }
      })
    }
  }
}
</script>

<style lang="scss" scoped>
</style>
